<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<div id="roleGrid"></div>
<div id="roleToolbar">
	<div>
		<a href="#" class="easyui-linkbutton" onclick="role.toolbar.showAddDialog();" data-options="
		iconCls:'icon-add',
		plain:true">
			新增
		</a>
		<a href="#" class="easyui-linkbutton" onclick="role.toolbar.showUpdateDialog();" data-options="
		iconCls:'icon-edit',
		plain:true">
			修改
		</a>
		<a href="#" class="easyui-linkbutton" onclick="role.init();" data-options="
		iconCls:'icon-man',
		plain:true">
			显示启用角色
		</a>
		<a href="#" class="easyui-linkbutton" onclick="role.initclo();" data-options="
		iconCls:'icon-man',
		plain:true">
			显示禁用角色
		</a>
	</div>
	<div>
		<strong>输入角色名：</strong>
		<input type="text" name="name" class="easyui-textbox"id="searchName"/>
		<a href="#" onclick="role.toolbar.search()" class="easyui-linkbutton" data-options="
		iconCls:'icon-search',
		plain:true">
			查询
		</a>
	</div>
</div>
<div id="roleAddDialog" class="easyui-dialog ec-dialog" data-options="
title:'新增角色',
buttons:'#roleAddButtons',
closed: true,
onClose:role.toolbar.resetAddFrom">
	<form id="roleAddForm" method="post">
		<p>
			<strong>角色名：</strong>
			<input type="text" name="roleName" id="roleName" class="easyui-textbox" data-options="
			required:true">
		</p>
		<p>
			<strong>权限管理：</strong>
			<input type="text" id="menuAdd" name="menuAdd"style="width:140px">
		</p>
	</form>
</div>
<div id="roleAddButtons">
	<a href="#" onclick="role.toolbar.add()" class="easyui-linkbutton" data-options="
	iconCls: 'icon-add',
	plain: true">
		新增
	</a>
	<a href="#" onclick="role.toolbar.hiddenAddDialog();" class="easyui-linkbutton" data-options="
	iconCls: 'icon-redo',
	plain: true">
		取消
	</a>
</div>
<div id="roleUpdateDialog" class="easyui-dialog ec-dialog" data-options="
title:'修改角色信息',
buttons:'#roleUpdateButtons',
closed: true,
onClose:role.toolbar.resetUpdateFrom">
	<form id="roleUpdateForm" method="post">
	<input name="id" type="hidden"/>
		<p>
			<strong>角色名：</strong>
			<input type="text" name="roleName" id="roleName" class="easyui-textbox" data-options="
			required:true">
		</p>
		<p>
			<strong>权限管理：</strong>
			<input type="text" id="menuUpdate" style="width:140px">
		</p>
	</form>
</div>
<div id="roleUpdateButtons">
	<a href="#" onclick="role.toolbar.update()" class="easyui-linkbutton" data-options="
	iconCls: 'icon-edit',
	plain: true">
		修改
	</a>
	<a href="#" onclick="role.toolbar.hiddenUpdateDialog();" class="easyui-linkbutton" data-options="
	iconCls: 'icon-redo',
	plain: true">
		取消
	</a>
</div>
<script>
	 var role={
			 init : function() {
					role.roleGrid = $('#roleGrid');
					role.menuAdd = $('#menuAdd');
					role.roleAddDialog = $('#roleAddDialog');
					role.roleAddForm = $('#roleAddForm');
					role.roleUpdateForm = $('#roleUpdateForm');
					role.menuUpdate = $('#menuUpdate');
					role.roleUpdateDialog = $('#roleUpdateDialog');
					role.searchName = $('#searchName');
					
					role.roleGrid.datagrid({
					    url: '<%=request.getContextPath()%>/SysRoleServlet?command=listRole',
					    fitColumns: true,
					    striped: true,
					    rownumbers: true,
					    pagination: true,
					    pageSize: 10,
					    pageList: [10, 20, 30, 40, 50],
					    pageNumber: 1,
					    toolbar: '#roleToolbar',
					    columns:[[
							{field:'id', width:100, checkbox: true},
							{field:'name', title:'姓名', width:100, align:'center'},
							{field:'operate_time', title:'创建时间', width:100, align:'center'},
							{field:'stateStr', title:'状态', width:100, align:'center'},
							{field:'StateOp', title:'操作', formatter: role.row.showGender, width:100, align:'center'}
					    ]],
						onDblClickRow: function(rowIndex, rowData) {
							role.toolbar.showUpdateDialog(rowData.id);
						},
						onBeforeLoad: function(param){
								var name= $('#name').val();
								var time= $('#time').val();
								param.name=name;
								param.time=time;
						}
					});
				},
				
				initclo : function() {
					role.roleGrid = $('#roleGrid');
					role.menuAdd = $('#menuAdd');
					role.roleAddDialog = $('#roleAddDialog');
					role.roleAddForm = $('#roleAddForm');
					role.roleUpdateForm = $('#roleUpdateForm');
					role.menuUpdate = $('#menuUpdate');
					role.roleUpdateDialog = $('#roleUpdateDialog');
					role.searchName = $('#searchName');
					
					role.roleGrid.datagrid({
					    url: '<%=request.getContextPath()%>/SysRoleServlet?command=listRoleclo',
					    fitColumns: true,
					    striped: true,
					    rownumbers: true,
					    pagination: true,
					    pageSize: 10,
					    pageList: [10, 20, 30, 40, 50],
					    pageNumber: 1,
					    toolbar: '#roleToolbar',
					    columns:[[
							{field:'id', width:100, checkbox: true},
							{field:'name', title:'姓名', width:100, align:'center'},
							{field:'operate_time', title:'创建时间', width:100, align:'center'},
							{field:'stateStr', title:'状态', width:100, align:'center'},
							{field:'StateOp', title:'操作', formatter: role.row.showGender, width:100, align:'center'}
					    ]],
						onDblClickRow: function(rowIndex, rowData) {
							role.toolbar.showUpdateDialog(rowData.id);
						},
						onBeforeLoad: function(param){
								var name= $('#name').val();
								var time= $('#time').val();
								param.name=name;
								param.time=time;
						}
					});
				},
				
				
				toolbar: {
					showAddDialog: function() {
						role.menuAdd.combotree({
							url: '<%=request.getContextPath()%>/test/TestServlet?command=listMenu',
							multiple: true,
							checkbox: true,
							onlyLeafCheck: false,
							onLoadSuccess: function(node, data) {
								$(this).tree('expandAll')
							}
						});
						
						role.roleAddDialog.dialog('open');
						role.code.focus();
						// 坑，只能使用id选择器
						role.age.numberspinner('setValue', 20);
					},
					hiddenAddDialog: function() {
						$('#roleAddDialog').dialog('close');
						role.toolbar.resetAddForm();
						role.roleGrid.datagrid('reload');
					},
					resetAddForm: function() {
						role.roleAddForm.form('reset');
					},
					add: function() {
						if (role.roleAddForm.form('validate')) {
							$.messager.progress({
								text : '正在处理...'
							});
						
						var params = role.toolbar.getParams(role.menuAdd, role.roleAddForm.serialize());
						$.post('<%=request.getContextPath()%>/SysRoleServlet?command=addRole', params , function(data) {
							if (data) {
								$.messager.show({
									title: '系统提示',
									msg: '新增成功！',
									timeout: 3000,
									showType: 'slide'
								});
								
							} else {
								$.messager.alert('系统提示', '新增失败！', 'error')
							}
							$.messager.progress('close');
							role.toolbar.hiddenAddDialog();
						});
					}
				},
				getParams: function(menu, defaultSerialize) {
					var treeObj = menu.combotree('tree');
					var indeterminateNodes = treeObj.tree('getChecked', ['checked','indeterminate']);
					var indeterminateNodeIds = [];
					$.each(indeterminateNodes, function(i, v) {
						indeterminateNodeIds.push('&menu=' + v.id);
					});
					return defaultSerialize + indeterminateNodeIds.join('');
						
					},
					
					//显示修改界面
					showUpdateDialog: function(id) {
						/* role.toolbar.showCombotree(); */
						/* role.roleUpdateDialog.dialog('open'); */
						var getData = function(v) {
							
							$.post('<%=request.getContextPath()%>/SysRoleServlet?command=getRole', {id : v}, function(data) {
								if (data) {
									role.roleUpdateForm.form('load', {
										id:data.id,
										roleName: data.name,
									});
									
									/* var checkedItems = data.menu_ids; */
									var checkedItems = data.menu_ids.split(',');
									role.menuUpdate.combotree({
										url: '<%=request.getContextPath()%>/test/TestServlet?command=listMenu',
										multiple: true,
										checkbox: true,
										onlyLeafCheck: false,
										onLoadSuccess: function(node, data) {
											var that = this;
											$(that).tree('expandAll')
											if (data) {
												
												$(data).each(function(index, value) {
														if ($.inArray(value.id + '', checkedItems) != -1) {
															$(that).tree('check', value.target);
														} else{
															$(that).tree('uncheck', value.target);
														}
												});
											}
										}
									});
									$('#roleUpdateDialog').dialog('open');
								} else {
									$.messager.alert('系统提示', '获取信息失败！', 'error')
								}
								$.messager.progress('close');
							}, 'json');
						}
						if (id) {
							getData(id);
						} else {
							var row = role.roleGrid.datagrid('getSelections');
							if (row.length == 1) {
								getData(row[0].id);
							} else {
								$.messager.show({
									title: '系统提示',
									msg: '请选择一行数据进行修改！',
									timeout: 3000,
									showType: 'slide'
								});	
							}
						}
					},
					
					hiddenUpdateDialog: function() {
						$('#roleUpdateDialog').dialog('close');
						/* role.toolbar.resetUpdateFrom(); */
						role.roleGrid.datagrid('reload');
					},
					resetUpdateFrom: function() {
						role.roleUpdateForm.form('reset');
					},
					
					update: function() {
						if (role.roleUpdateForm.form('validate')) {
							$.messager.progress({
								text : '正在处理...'
							});
							var params = role.toolbar.getParams(role.menuUpdate, role.roleUpdateForm.serialize());
							console.info(params);

							$.post('<%=request.getContextPath()%>/SysRoleServlet?command=updaterole', params, function(data) {
								if (data == 1) {
									$.messager.show({
										title: '系统提示',
										msg: '修改成功！',
										timeout: 3000,
										showType: 'slide'
									});
									role.toolbar.resetUpdateFrom();
									role.roleGrid.datagrid('reload');
								} else {
									$.messager.alert('系统提示', '修改失败！', 'error');
								}
								$.messager.progress('close');
								role.toolbar.hiddenUpdateDialog();
							});
							
							
						}
					},
					redo: function() {
						role.roleGrid.datagrid('unselectAll');
					},
					search: function(){
						/* alert(role.searchName.val()); */
						role.roleGrid.datagrid('load',{
							SearchName: role.searchName.val()
						});
						
					}
				},
				row : {
					showGender: function(value, row) {
						var id = row.id;
						var state = row.state;
						if (!value) {
						 value = state == 1 ? '禁用' : '启用';
						}
						var operations = [];
						operations.push('<a href="javascript:void(0)" onclick="role.row.updateGender(\'' + id + '\',  \'' + value + '\')">' + value + '</a>');
						return operations.join('');
					},
					updateGender: function(id, value) {
						$.messager.confirm('Confirm', '你确定要更改状态吗?', function(result){
							if (result){
								
								 $.ajax({   
						                url: '<%=request.getContextPath()%>/SysRoleServlet?command=updateOpRole' + "&id=" + id + "&value=" + value,//传参数到一般处理方法，并赋值  
						                 
						            type:"Post",  
						                dataType:"json",  
						                success: function (data) {//ajax请求完成时执行，data为返回的结果  
						                	$.messager.show({
												title: '系统提示',
												msg: '状态修改成功！',
												timeout: 3000,
												showType: 'slide'
											});
						                	role.roleGrid.datagrid('reload');
						                }  
						            });  
								
								
							} else {
								$.messager.alert('系统提示', '状态修改失败！', 'error')
							}
						});
					}
				} 
			};
	 
			
			$(function(){
				role.init();
			});
</script>